<template>

  <el-row>
    <el-col :span="24">
      <div class="grid-content bg-purple-dark">
        <h1>{{get}}</h1>
        <h1>{{getUser}}</h1>
        <el-button size="mini" @click="bbb('00937363')">mini</el-button>
        <el-button size="mini" @click="login">mini</el-button>
        <router-link to="login"><el-button size="mini">Login</el-button></router-link>
        <el-button size="mini" @click="toLogin">toLogin</el-button>
      </div>
    </el-col>
  </el-row>

</template>

<script>

import {mapGetters, mapActions} from 'vuex'

export default {
  name: 'HelloWorld',
  data () {
    return {
      msg: 'HelloWorld'
    }
  },
  created: function () {
    var _this = this
    console.log('-----', _this.$store.state.module)
  },
  computed: {
    ...mapGetters({
      getUser: ['getUser'],
      get: ['moduleA/get'],
      getA: ['moduleA/get_aaaa']
    })
  },
  methods: {
    bbb: function (tmp) {
      let aa = {aaaa: tmp, bbbb: 2}
      this.$store.dispatch('moduleA/setModuleAState', aa)
      console.log('-----', this.get)
    },
    login: function () {
      let tmp = {
        name: 'casper',
        isLogin: true,
        token: '09988762'
      }
      this.$store.dispatch('login', tmp)
    },
    toLogin: function () {
      this.$router.push('/login')
    }
  }
}
</script>
<style scoped>
.el-row {
    margin-top: 10px;
    &:last-child {
      margin-bottom: 0;
    }
  }
</style>
